import React from 'react'
import styles from './pay.module.css'
export default function Weather({ paylist }) {
    return (
        <div className={styles.box}>
            <div style={{ fontSize: 30, color: 'white', paddingBottom: 5 }} >江夏区</div>

            <div className={styles.son}>

                <div>
                    <div style={{ fontWeight: 'bold', paddingTop: 5, color: 'white', textAlign: 'center' }}>
                        <div style={{ fontSize: 40, paddingTop: 50 }}>{paylist.temperature}℃</div>
                        <div style={{ fontSize: 15 }}>{paylist.weather}</div>

                    </div>
                    <div style={{ fontSize: 10, color: 'white', textAlign: 'center' }}>
                        <span >温度</span>
                        <span>{paylist.apparentTemperature}℃</span>
                    </div>
                    <div style={{ fontSize: 10, color: 'white', paddingTop: 10, textAlign: 'center' }}>
                        <span >{paylist.air}</span>
                         
                    </div>
                </div>


            </div>

            <div>
                <div style={{ fontSize: 10, marginBottom: 10 ,marginTop: 10}}>气象信息</div>
                <div style={{ fontSize: 10, marginBottom: 10 ,marginTop: 10,color: '#1366f4',}}>
                    <span>最低温度</span>
                    <span>{paylist.maxTemperature}℃</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 
                    <span>最高温度</span>
                    <span>{paylist.minTemperature}℃</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 
                    <span>紫外线:</span>
                    <span>{paylist.uv}</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 
                    <span>湿度:</span>
                    <span>{paylist.humidity}</span>
                </div>
            </div>
        </div>
    )
}


